<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户列表</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <!-- <script src="js/bootstrap.min.js"></script> -->
    <style>
        .container {
            width: 1200px;
            margin: 0 auto;
        }
        
        .margin-top {
            margin-top: 10px;
        }
        
        form {
            width: 100%;
        }
        
        th,
        td {
            border: 1px solid #ccc;
            padding-left: 6px;
            height: 30px;
        }
        
        td:nth-child(1) {
            width: 200px;
        }
        
        td:nth-child(2) {
            width: 150px;
        }
        
        td:nth-child(3) {
            width: 250px;
        }
        
        td:nth-child(4) {
            width: 300px;
        }
        
        td:nth-child(5) {
            width: 200px;
        }
        
        tr td span {
            display: inline-block;
            padding: 2px;
            border-radius: 5px;
            color: #fff;
            font-size: 12px;
            cursor: pointer;
        }
        
        #delete {
            background-color: red;
        }
        
        #modify {
            margin-left: 6px;
            background-color: green;
        }
    </style>
</head>

<body>
    <div class="container">
        <button class="btn btn-primary margin-top" type="button">
      添加用户
    </button>
        <form action="localhost:8090">
            <table>
                <tr>
                    <th>用户名</th>
                    <th>年龄</th>
                    <th>爱好</th>
                    <th>邮箱</th>
                    <th>操作</th>
                </tr>
                <tr>
                    <td>张三</td>
                    <td>25</td>
                    <td>足球</td>
                    <td>541</td>
                    <td><span id='delete'>删除</span><span id='modify'>修改</span></td>
                </tr>
            </table>

        </form>
    </div>
    <script>
        var button = document.querySelector('button')

        button.onclick = function() {
            console.log(11)
        }
    </script>
</body>

</html>